@namespace BlazorFluentUI
@using Microsoft.AspNetCore.Components.Web
@inherits ResponsiveComponentBase

<div class="ms-ContextualMenu-root">
    <Callout FabricComponentTarget=@FabricComponentTarget
                IsBeakVisible=@((int)CurrentMode <= (int)ResponsiveMode.Medium ? true : IsBeakVisible)
                BeakWidth=@BeakWidth
                DirectionalHint=@DirectionalHint
                GapSpace=@GapSpace
                CoverTarget=@CoverTarget
                ClassName="ms-ContextualMenu-callout"
                Bounds=@Bounds
                DirectionalHintFixed=@DirectionalHintFixed
                AlignTargetEdge=@AlignTargetEdge
                SetInitialFocus=@ShouldFocusOnMount
                OnPositioned=@OnCalloutPositioned
                OnDismiss=@OnCalloutDismiss>
        @*TabIndex set to -1 so it is focusable, ignoring option to focus on "container??"*@
        <div aria-label=@AriaLabel
             style=""
             tabindex="-1"
             class="ms-ContextualMenu-container">
            @if (Title != null)
            {
                <div class="ms-ContextMenu-title">
                    @Title
                </div>
            }
            @if (Items != null && Items.Count() > 0)
            {
                <FocusZone ClassName=@($"ms-ContextualMenu")
                              @ref="_focusZoneReference"
                              Direction="FocusZoneDirection.Vertical"
                              IsCircularNavigation="true"
                              HandleTabKey="FocusZoneTabbableElements.All">
                    <ul class="ms-ContextualMenu-list" role="menu">
                        @foreach (var item in Items)
                        {
                            @if (ItemTemplate != null && SubordinateItemTemplate == false)
                            {
                                <li>
                                    @ItemTemplate(item)
                                </li>
                            }
                            else
                            {
                                if (item is IContextualMenuItem contextualMenuItem)
                                {
                                    <BlazorFluentUI.ContextualMenuInternal.ContextualMenuItem CanCheck=@contextualMenuItem.CanCheck
                                                                                                 Checked=@contextualMenuItem.Checked
                                                                                                 ClassName=@contextualMenuItem.ClassName
                                                                                                 Command=@contextualMenuItem.Command
                                                                                                 CommandParameter=@contextualMenuItem.CommandParameter
                                                                                                 Disabled=@contextualMenuItem.Disabled
                                                                                                 Href=@contextualMenuItem.Href
                                                                                                 IconName=@contextualMenuItem.IconName
                                                                                                 IconSrc=@contextualMenuItem.IconSrc
                                                                                                 Items=@contextualMenuItem.Items
                                                                                                 ItemType=@contextualMenuItem.ItemType
                                                                                                 Key=@contextualMenuItem.Key
                                                                                                 OnClick=@(contextualMenuItem.OnClick!)
                                                                                                 SecondaryText=@contextualMenuItem.SecondaryText
                                                                                                 Split=@contextualMenuItem.Split
                                                                                                 Style=@contextualMenuItem.Style
                                                                                                 Text=@contextualMenuItem.Text
                                                                                                 OnKeyDown=@KeyDownHandler
                                                                                                 DismissMenu=@Dismiss
                                                                                                 HasIcons=@HasIcons
                                                                                                 HasCheckables=@HasCheckables
                                                                                                 SetSubmenu=@OnSetSubmenu
                                                                                                 SubmenuActiveKey=@SubmenuActiveKey
                                                                                                 NotifyCalloutDismiss=@OnNotifyCalloutDismiss />
                                }
                                else if (ItemTemplate != null)
                                {
                                    <li>
                                        @ItemTemplate(item)
                                    </li>
                                }
                                else
                                {
                                    throw new Exception("ItemTemplate or ItemTemplateSelector needs to be defined if items are used, which are not type of IContextualMenuItem");
                                }
                            }
                        }
                    </ul>
                </FocusZone>
            }
        </div>

    </Callout>
</div>